<template>
	<view class="empty-container w-full h-full">
		<view  class="flex-column align-center empty-car">
			<!-- <image src="@/static/images/my/empty-car.png"></image> -->
			<image src="../../../static/my/empty-car.png"></image>
			<text class="tips mt-10">您还没有绑定车辆，快去绑定吧～</text>
			<view class="add flex-center align-center mt-50">
				<u-icon name="plus-circle-fill" size="35"></u-icon>
				<text class="ml-10" @click="handleAdd">新增车辆绑定</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data () {
			return {}
		},
		methods: {
			handleAdd () {
				this.$emit('openCarPlate')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.empty-container{
		padding: 30rpx;
		background: linear-gradient(180deg, #FFFFFF 9%, #F8F8F8 42%);
		image{
			width: 170rpx;
			height: 169rpx;
		}
		.tips{
			font-family: PingFang SC;
			font-size: 26rpx;
			font-weight: 400;
			color: #919EB5;
		}
		.add{
			width: 380rpx;
			height: 86rpx;
			background: #3680FF1A;
			border: 1px solid #3A67D5;
			border-radius: 60rpx;
			font-family: PingFang SC;
			font-size: 32rpx;
			font-weight: 500;
			color: #3A67D5;

		}
	}
	.empty-car{
		position: relative;
		top: 16%;
	}
</style>